<template>
	<view>
		<view v-for="(item,index) in BookList" :key="item.id" class=".progress_block">
			<view class="name">
				{{item.book_name}}
			</view>
			<view class="isbn">
				ISBN:{{item.isbn}}
			</view>
			<view class="PriIcon">
					<u-icon name="rmb-circle-fill" size="20" color="green"></u-icon>
			</view>
			<view class="price">
				价格：{{item.price}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"purchasemode",
		props: {
			BookList: {
				type: Array,
			},
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
.progress_block {
			display: flex;
			width: 93%;
			margin: auto;
			margin-bottom: 20rpx;
			border-radius: 20rpx;
			height: 200rpx;
			position: relative;
			overflow: hidden;
			background-color: #fff;
			box-shadow: 0.5rpx 0.5rpx 40rpx #DBDBDB;
			.name {
				position: absolute;
				top: 15rpx;
				// color: #fff;
				height: 20%;
				font-size: 36rpx; 
				font-weight: 800;
				margin-bottom: 50rpx;
				left: 10%;
			}
			.isbn{
				position: absolute;
				top: 95rpx;
				left: 10%;
				font-size: 34rpx;
			}
			.PriIcon{
				position: absolute;
				left: 72%;
				top: 50%;
				// font-family: ;
			}
			.price{
				position: absolute;
				top: 95rpx;
				left: 80%;
				font-size: 34rpx;
			}
}
</style>
